<template>
  <!-- 没写出来 -->
  <div id="app">
    <h2>测试题</h2>
    <MySubject @count="bijiao"></MySubject>
    <!-- <MySubject @count="done === $event"></MySubject>
    <MySubject @count="done === $event"></MySubject>
    <MySubject @count="done === $event"></MySubject>
    <MySubject @count="done === $event"></MySubject> -->
    <!-- <div> -->
    <!-- <MyFlag :flag="done" v-for="item in 5" :key="item"></MyFlag> -->
    <!-- <MyFlag v-model="done"></MyFlag> -->
    <!-- </div> -->
  </div>
</template>

<script>
import MySubject from "./components/MySubject.vue";
// import MyFlag from "./components/MyFlag.vue";
export default {
  components: {
    MySubject,
    // MyFlag,
  },
  data() {
    return {
      done: false,
    };
  },
  methods: {
    // bijiao(flag) {
    //   if (flag === this.done) {
    //     this.done = true;
    //     console.log(this.done);
    //   } else {
    //     this.done = false;
    //     console.log(this.done);
    //   }
    // },
  },
};
</script>

<style>
body {
  background-color: #eee;
}

#app {
  background-color: #fff;
  width: 500px;
  margin: 50px auto;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
  padding: 2em;
}
</style>
